.others {
  padding : 80px;
  overflow: auto;
  height  : 100%;

  .top-body {
    background   : #3399FF;
    border-radius: 8px;
    height       : 280px;

    .fl {
      padding: 40px;
      color  : #fff;

      h1 {
        color    : #fff;
        font-size: 36px;
        margin   : 0;
      }

      span {
        display      : block;
        font-size    : 16px;
        margin-bottom: 75px;
      }

      a {
        padding      : 0 40px;
        background   : #FFFFFF;
        box-shadow   : 0px 4px 8px rgba(0, 86, 171, 0.2);
        border-radius: 2px;
      }
    }

    .fr {
      img {
        max-width   : 280px;
        max-height  : 280px;
        margin-right: 80px;
      }
    }
  }

  .other-information {
    display  : flex;
    padding  : 0;
    flex-wrap: wrap;

    li {
      width          : 32%;
      min-height     : 320px;
      margin-right   : 24px;
      margin-top     : 24px;
      background     : #B0AFF4;
      border-radius  : 8px;
      padding        : 10px;
      list-style-type: none;

      &:nth-child(3n) {
        margin-right: 0;
      }

      .top {
        padding    : 15px 10px;
        font-size  : 18px;
        color      : #fff;
        display    : flex;
        align-items: center;

        a {
          color: #fff;
        }

        .icon-delete-bin-5-line {
          margin-left: 20px;
        }
      }

      .bottom {
        padding         : 24px;
        background-color: #fff;
        border-radius   : 8px;
        height          : 240px;

        span {
          display    : block;
          line-height: 32px;
        }

      }
    }
  }

  .modal {
    .ant-modal-content {}
  }

  .ant-modal {
    width: 640px;
  }
}